<div>
	<nz-page-header [nzGhost]="false">
		<nz-page-header-title>欢迎</nz-page-header-title>
		<nz-page-header-subtitle>Duhbhe 云平台前端</nz-page-header-subtitle>
	</nz-page-header>
</div>

<div>
	<nz-card>
		<h1 nz-typography>欢迎光临</h1>
	</nz-card>

	<nz-card nzTitle="ngx-pipes" class="space-item">
		<div>
			<p>{{ ' foo' | ltrim | reverse }}</p>
		</div>
		<div><button nz-button (click)="noticSrc.success('操作成功', '保存订单成功')">Notification</button></div>
	</nz-card>

	<nz-card nzTitle="页面" class="space-item">
		<nz-space>
			<button *nzSpaceItem nz-button (click)="router.navigateByUrl('base/exception/404')">404页面</button>
			<button *nzSpaceItem nz-button (click)="router.navigateByUrl('/base/exception/403')">403页面</button>
			<button *nzSpaceItem nz-button (click)="router.navigateByUrl('/base/exception/500')">500页面</button>
		</nz-space>
		<nz-divider></nz-divider>
		<nz-space>
			<button *nzSpaceItem nz-button (click)="router.navigateByUrl('/passport/login')">登录</button>
			<button *nzSpaceItem nz-button (click)="router.navigateByUrl('/passport/register')">注册</button>
			<button *nzSpaceItem nz-button (click)="router.navigateByUrl('/passport/authorization-code')">验证码登录</button>
			<button *nzSpaceItem nz-button (click)="router.navigateByUrl('/passport/should-login')">统一登录</button>
		</nz-space>
	</nz-card>

	<nz-card nzTitle="富文本编辑"  class="space-item">
		<tinymce [(ngModel)]="html"></tinymce>
	</nz-card>

	<nz-card nzTitle="登录信息" class="space-item">
		<p>
			<button class="btn btn-success mr-1" (click)='login()'>login</button>
			<button class="btn btn-primary mr-1" (click)='logout()'>logout</button>
			<button class="btn btn-link mr-1" (click)='logoutExternally()'>logout externally...</button>
		</p>
		<p>
			<button class="btn btn-warning mr-1" (click)='refresh()'>force silent refresh</button>
			<button class="btn btn-secondary mr-1" (click)='reload()'>reload page</button>
			<button class="btn btn-danger mr-1" (click)='clearStorage()'>clear storage</button>
		</p>
		<hr>
		<table class="table table-bordered table-sm table-props">
			<tr>
				<th>IsAuthenticated</th>
				<td><code id="isAuthenticated">{{isAuthenticated$ | async}}</code></td>
			</tr>
			<tr>
				<th>HasValidToken</th>
				<td><code id="hasValidToken">{{hasValidToken}}</code></td>
			</tr>
			<tr>
				<th>IsDoneLoading</th>
				<td><code id="isDoneLoading">{{isDoneLoading$ | async}}</code></td>
			</tr>
			<tr>
				<th>CanActivateProtectedRoutes</th>
				<td><code id="canActivateProtectedRoutes">{{canActivateProtectedRoutes$ | async}}</code></td>
			</tr>
			<tr>
				<th>IdentityClaims</th>
				<td class="pre"><code id="identityClaims">{{identityClaims | json}}</code></td>
			</tr>
			<tr>
				<th>RefreshToken</th>
				<td><code class="break-all">{{refreshToken}}</code></td>
			</tr>
			<tr>
				<th>AccessToken</th>
				<td><code class="break-all">{{accessToken}}</code></td>
			</tr>
			<tr>
				<th>IdToken</th>
				<td><code class="break-all">{{idToken}}</code></td>
			</tr>
		</table>
	</nz-card>
</div>